xquery version "1.0";

import module namespace layout="http://www.example.com/layout" at "xmldb:exist:///db/projdb/modules/layout.xqm";
(:"xmldb:exist:///db/projdb/modules/layout.xqm";:)

declare option exist:serialize "doctype-public=-//W3C//DTD&#160;XHTML&#160;1.1//EN
                                doctype-system=http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd";

<html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>Activiteit in de plenaire vergaderingen</title>
        <link rel="stylesheet" style="text/css" href="style/core_layout.css"/>
		<link type="text/css" href="style/smoothness/jquery-ui-1.8.18.custom.css" rel="stylesheet" />	
		<script type="text/javascript" src="js/jquery.js"><!-- --></script>
        <script type="text/javascript" src="https://www.google.com/jsapi"><!-- --></script>
		<script type="text/javascript" src="js/jquery-ui-1.8.18.custom.min.js"><!-- --></script>
        <script type="text/javascript" src="js/activity.js"><!-- --></script>
        <script type="text/javascript" src="js/myScripts.js"><!-- --></script>
        <script type="text/javascript">
        //<![CDATA[
            google.load("visualization", "1", {packages:["corechart"]});
            google.setOnLoadCallback(function() {
                initShowHideButtons();
                activity_createConfigurationTools();

                activity_setUpdateFunction(function(xml) {
                    activity_loadPartyChart(xml, "ppartyValueChartContainer", 700, 400);
                    activity_loadManWomenChart(xml, "manWomenValueChartContainer", 350, 200);
                    activity_loadMayorChart(xml, "mayorValueChartContainer", 350, 200);
                    activity_loadRankingList(xml, "detailedList", true);
                    activity_loadTopList(xml, "detailedList", "mostActiveList", "leastActiveList");
                });

                activity_run();
            });
        //]]>
        </script>
        
        
    </head>
    <body>	
        <div class="containerBox">
        {layout:topMenu()}
        
        {layout:titleBox('Activiteitsgraad')}
        
        
        {layout:anonymousContentBox("mostAndLeastActiveBox", "Overzicht",
            layout:twoColumnsDark(layout:columnDescription("Meest actief", <ol id="mostActiveList"><!-- //--></ol>),
                              layout:columnDescription("Minst actief", <ol id="leastActiveList"><!-- //--></ol>)))}


        <div class="box" id="configurationBox">
            <div class="margin">
                <h2 class="boxTitle">Gewichten bij beschouwde parameters aanpassen</h2>
                <div class="boxDescription">
                <p>Iedere persoon heeft een activiteitsgraad toegekend gekregen op basis van een aantal meetbare parameters die uit de database kunnen worden afgeleid. De parameters zelf worden procentueel uitgedrukt tenopzichte van de maximale waarde die een persoon voor die parameter heeft. De activiteitsgraad zelf wordt bekomen door de optelsom te nemen van deze parameters en een bepaald gewicht dat eraan wordt toegekend.</p>
                </div>
                <div class="boxContent">
                    <div class="inputField">
                        <div class="label">Aanwezigheid:</div> 
                        <div id="presentSlider" class="slider"><!-- --></div>
                        <input type="text" id="presentAmount" />
                    </div>
                    <div class="inputField">
                        <div class="label">Deelname aan agendapunten:</div> 
                        <div id="participationSlider" class="slider"><!-- --></div>
                        <input type="text" id="participationAmount" />
                    </div>
                    <div class="inputField">
                        <div class="label">Co/eigen agendapunten:</div> 
                        <div id="initiativesSlider" class="slider"><!-- --></div>
                        <input type="text" id="initiativesAmount" />
                    </div>
                    <div class="inputField">
                        <div class="label">Onderbrekingen:</div> 
                        <div id="interuptionSlider" class="slider"><!-- --></div>
                        <input type="text" id="interuptionAmount" />
                    </div>
                    <div class="inputField">
                        <div class="label">Gemiddeld # woorden:</div> 
                        <div id="wordCountSlider" class="slider"><!-- --></div>
                        <input type="text" id="wordCountAmount" />
                    </div>
                    <div class="inputField">
                        <div class="label">Initiatieven waaraan deelgenomen:</div> 
                        <div id="initiatedParticipationSlider" class="slider"><!-- --></div>
                        <input type="text" id="initiatedParticipationAmount" />
                    </div>
                    <br class="clearer"/>
                    <span class="title">In lijst:</span>
                    <input class="includeChairField" type="checkbox" name="includeChair" /> voorzitter
                    <input class="includeGovernmentField" type="checkbox" name="includeGovernment" /> regeringsleden
                    <input class="includeMPField" type="checkbox" name="includeMP" /> volksvertegenwoordigers
                </div>
            </div>
        </div>

        <div class="box" id="manWomenValueChartBox">
            <div class="margin">
                <h2 class="boxTitle">Mannen vs vrouwen | Burgemeesters vs niet-burgemeesters</h2>
                <div class="boxContent columnContent">
                    <div class="columnspace twoColumns">
                    <div class="column" id="manWomenValueChartContainer">
                        <!-- Auto generated -->
                    </div>
                     <div class="column" id="mayorValueChartContainer">
                        <!-- Auto generated -->
                    </div>
                    <br class="clearer" />
                    </div>
                </div>
            </div>
        </div>

        <div class="box" id="ppartyValueChartBox">
            <div class="margin">
                <h2 class="boxTitle">Politieke partijen</h2>
                <div class="boxContent columnContent">
                    <div id="ppartyValueChartContainer">
                        <!-- Auto generated -->
                    </div>
                </div>
            </div>
        </div>

        <div class="box" id="detailedListBox">
            <div class="margin">
                <h2 class="boxTitle">Volledige lijst <span class="button"></span></h2>
                <div class="boxContent darkBackground hideByDefault">
                    <div class="legende">
                        <h3 class="contentTitle">Legende</h3>
                        <ul>
                            <li><span class="chairRole">Voorzitter</span></li>
                            <li><span class="mpRole">Volksvertegenwoordiger</span></li>
                            <li><span class="mayorRole">Burgemeester</span></li>
                            <li><span class="governmentRole">Regeringslid</span></li>
                        </ul>
                    </div>
                    <h3 class="contentTitle">Lijst</h3>
                    <ol id="detailedList"><!-- -->
                    </ol>
                </div>
            </div>
        </div>
        </div>
    </body>
</html>
